<template>
	<view class="bosss">

		<view class="xiangqingdebox">
			<view v-for="(itenm,index) in 5" :key="index" class="jutixiag">
				<view class="xiangtu">
					<image src="https://dfgq3654.laidianbanlv.cn/images/duanju/shuangju123.jpg" mode=""></image>

				</view>
				<view class="xiaidbxiaob">
					<view class="xiaozuo">
						已完结
					</view>
					<view class="xizoyouoy">
						共100集
					</view>
				</view>
				<view class="iangtitle">
					name
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import request from '../../utils/request.js';
	import api from '../../utils/url.js';
	import {
		mapState,
		mapActions
	} from 'vuex'
	export default {
		data() {
			return {
				id: ''
			}
		},
		computed: {
			...mapState({

			})
		},
		components: {

		},
		onLoad(res) {
			var that = this
			that.id = res.id


		},
		onShow() {


		},
		onPageScroll: function(e) { //nvue暂不支持滚动监听，可用bindingx代替
			// console.log("滚动距离为：" + e.scrollTop);
		},
		onReachBottom() {
			// console.log('触底');

		},
		methods: {



		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f8f8f8;
	}

	.xiangqingdebox {
		width: 100%;
		display: flex;
		flex-flow: row wrap;
		justify-content: left;
		align-items: center;
	}

	.jutixiag {
		width: 30%;
		margin-left: 20rpx;
		margin-top: 20rpx;
		// border: 1px solid #000;
	}

	.xiangtu image {
		width: 200rpx;
		height: 300rpx;
		border-radius: 20rpx;
		display: flex;
		margin: 0 auto;
	}

	// .f {
	// 	text-align: center;
	// }

	.xiaidbxiaob {
		width: 100%;
		display: flex;
		flex-flow: row;
		justify-content: space-between;
	}

	.iangtitle {
		text-align: center;
	}
</style>